<script language="javascript" type="text/javascript" src="/assets/My97DatePicker/WdatePicker.js"></script>
<style>
    #img_fix .img_fix{
        display: inline-block;
        width:100px;
        height:80px;
    }
    .sc_imgbox{  float:left;}
    .sc_btn{ width:100px; height:40px; text-align:center; line-height:40px; background:#ff9a00; font-size:16px; color:#fff; border-radius:3px; margin-top:20px; margin-left:100px; cursor:pointer;}
    .scbtn{padding:9px 18px;background:#40AFFE;color:#fff;border-radius:5px; display:none;}
    .upimg{position:relative;width:100px;height:100px;background:url(/assets/style/images/addimg.png) no-repeat; background-size:cover; float:left;}
    .upimg input{position:absolute;width:100px;height:100px;opacity:0;}
    #showimg{margin-left: -50px;}
    #showui {
        float: left;
    }
    #showui li .showimg{
       width:100px;
        height:80px;
    }
    #showui li {
        width: 100px;
        height: 100px;
        position: relative;
        overflow: hidden;
        display: inline-block;
        margin-right: 5px;
        margin-bottom: 5px;
    }
    .showdiv {
        position: absolute;
        z-index: 9;
        bottom: 0;
        width: 100%;
        padding: 6px 0;
        display: flex;
        justify-content: space-around;
        background: rgba(0,0,0,.6);
    }
    .showdiv img {
        width: 20px;
        height: 20px;
        cursor: pointer;
    }
    img {
        border-style: none;
        border: 0;
        padding: 0;
        margin: 0;
        display: block;
    }
    .imglist{position: relative;width:100px;height: 80px;float: left;margin-right: 10px;}
    .imglist i.closepic{width: 20px;
        height: 20px;
        display: block;
        position: absolute;
        right: -5px;
        top: -10px;
        cursor: pointer;
        text-align: center;
        line-height: 16px;
        border: 1px solid #333;
        border-radius: 50%;
        font-size: 14px;
        background: #fff;
        font-weight: normal;
        color: #333;}
        .imageContainer{position: relative;margin-top:20px;}
.filetxt{width:70px; display:block;  float: left;  color: #666;  text-align: right; font-size: 12px;margin-top: 42px;}
.imageContainer input{width:100px;height:100px;opacity:0;position:absolute;z-index:20;}
#showImage{width:98px;height:98px;border-radius:49%; float:left; margin-left:20px; display:none;position: relative;top:1px; left: -119px;}
.previewDiv{width:100px;height:100px;border-radius:100%;position: relative;background:#f6f6f6;border:1px solid #00a0e9; float:left; text-align:center; cursor: pointer;}
.upload-text{text-align:center; line-height:100px; cursor: pointer;}
.imgbtn{ width:120px; height:40px; margin-top:30px; border-radius:4px; background:#ddd; float:left; text-align:center; line-height:40px; color:#fff; margin-left:20px;}
.img_active{ background:#45aded; cursor:pointer;}
        select{height: 24px; position: relative;top: 2px;}
    .inputclass{ width: 500px;}
    .box2 img{border-radius:50px} 
    .box2 i.closepic{width: 20px;
        height: 20px;
        display: block;
        position: absolute;
        right: -5px;
        top: -20px;
        cursor: pointer;
        text-align: center;
        line-height: 16px;
        border: 1px solid #333;
        border-radius: 50%;
        font-size: 14px;
        background: #fff;
        font-weight: normal;
        color: #333;}
</style>
<div class="content">
    <form id="add_form" class="form-horizontal nice-validator n-default n-bootstrap" role="form" data-toggle="validator" method="POST" action="" novalidate="novalidate">
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">用户:</label>
            <div class="col-xs-12 col-sm-8">
                {if $res.userid}
                <span style="margin-top:12px; position: relative; top:7px;">{$res.username}</span>
                {else/}
                <input type="text" name="username" value="{$res.username}" id="userid"/>
                {/if}
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">上传头像:</label>
            {if $res.userid}
            <div class="imageContainer fix">
                <div class="previewDiv">
                    <div class="upload-text">
                        <div class="box2">
                            {if $res.userimg}
                            <img src="{$res.userimg}" width="98" height="98">
                            {else/}
                            <img src="/assets/style/images/tou1.png" width="98" height="98">
                            {/if}
                        </div>
                        
                    </div>
                </div>
            </div>
            {else/}
            <div class="imageContainer fix">
                <input id="thumbnail"  required type="file" size="100">
                <div class="previewDiv">
                    {if $res.userimg}
                    <div class="upload-text">
                        <div class="box2">
                            <img src="{$res.userimg}" width="98" height="98">
                            {if $res.userimg != '/assets/style/images/tou1.png'}
                            <i class="closepic">x</i>
                            {/if}
                        </div>
                    </div>
                    {else/}
                    <div class="upload-text"><div class="box2"><img src="/assets/style/images/tou1.png" width="98" height="98"></div></div>
                    {/if}
                    <div id="upload-text" style="display: none;"><div class="box2"><img src="/assets/style/images/tou1.png" width="98" height="98"></div></div>
                </div>
                <image id="showImage"></image>
                <input type="hidden" name="userimg" value="" id="userimg"/>
            </div>
            {/if}

            
        </div>

       


        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">总体评价:</label>
            <div class="col-xs-12 col-sm-8">
                <select name="pnum" style="float:left;margin-right: 5px;">
                    {volist name="evaluation_score" id="vo" key="k"}
                    <option value="{$resArr[$vo]}" {if condition="$resArr[$vo] eq $res.pnum"}selected="selected"{/if}>{$vo}</option>
                    {/volist}
                </select>
                <!-- <input type="text" name="pnum_info" class="inputclass" value="{$res.pnum_info}"> -->
                <textarea name="pnum_info"  id="pnum_info" style="width:500px;height:80px;">{$res.pnum_info}</textarea>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">导游服务:</label>
            <div class="col-xs-12 col-sm-8">
                <select name="guide_num">
                    {volist name="evaluation_score" id="vo" key="k"}
                    <option value="{$resArr[$vo]}" {if condition="$resArr[$vo] eq $res.guide_num"}selected="selected"{/if}>{$vo}</option>
                    {/volist}
                </select>
                <input type="text" name="guide_info" class="inputclass" value="{$res.guide_info}">
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">行程安排:</label>
            <div class="col-xs-12 col-sm-8">
                <select name="trip_num">
                    {volist name="evaluation_score" id="vo" key="k"}
                    <option value="{$resArr[$vo]}" {if condition="$resArr[$vo] eq $res.trip_num"}selected="selected"{/if}>{$vo}</option>
                    {/volist}
                </select>
                <input type="text" name="trip_info" class="inputclass" value="{$res.trip_info}">
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">餐饮住宿:</label>
            <div class="col-xs-12 col-sm-8">
                <select name="food_num" id="food_num">
                    {volist name="evaluation_score" id="vo" }
                    <option value="{$resArr[$vo]}" {if condition="$resArr[$vo] eq $res.food_num"}selected="selected"{/if} >{$vo}</option>
                    {/volist}
                </select>
                <input type="text" name="food_info" class="inputclass" value="{$res.food_info}">
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">旅行交通:</label>
            <div class="col-xs-12 col-sm-8">
                <select name="service_num" id="service_num">
                    {volist name="evaluation_score" id="vo" key="k"}
                    <option value="{$resArr[$vo]}" {if condition="$resArr[$vo] eq $res.service_num"}selected="selected"{/if} >{$vo}</option>
                    {/volist}
                </select>
                <input type="text" name="traffic_info" class="inputclass" value="{$res.traffic_info}">
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">状态:</label>
            <div class="col-xs-12 col-sm-8">
                <input  name="mstatus"  value="0" type="radio" {if condition="$res.mstatus eq 0"}checked="checked"{/if}>审核通过显示
                <input  name="mstatus"  value="1" type="radio" {if condition="$res.mstatus eq 1"}checked="checked"{/if}>不显示
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">加入时间:</label>
            <div class="col-xs-12 col-sm-8">
                <input class="Wdate" type="text"  name="updatetime"   value="{$res.updatetime|date='Y-m-d',###}" onClick="WdatePicker({el:this,dateFmt:'yyyy-MM-dd'})"/>
            </div>
        </div>
        <div class="form-group" style="display: none;">
            <label class="control-label col-xs-12 col-sm-2">内容:</label>
            <div class="col-xs-12 col-sm-8" >
                <textarea name="pmsg"  id="pmsg" style="width:582px;height:170px;">{$res.pmsg}</textarea>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">点评图片:</label>
            <div class="col-xs-12 col-sm-8" id="img_fix">
                {volist name="imgList" id="vo"}
                <div class="imglist">
                    <img src="{$vo.imgadr}" class="img_fix">
                    <i class="closepic" onclick="img_del('{$vo.id}',this);">x</i>
                </div>
                {/volist}
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2 ">上传照片</label>
            <div class="col-xs-12 col-sm-8 sc_imgbox">
                <div id="showimg">
                    <ul id="showui"></ul>
                    <div id="showinput"></div>
                </div>
                <div class="upimg">
                    <input type="file" id="upgteimg" value="" multiple />
                </div>
                <button class="scbtn" id="fsubmit">开始上传</button>
            </div>
        </div>
        <div id="img" style="display:none;">
        </div>
        <input type="hidden" name="img_temp" value="0" id="img_temp"/>
        <input type="hidden" name="id" value="{$res.id}" />
        <div class="form-group layer-footer">
            <label class="control-label col-xs-12 col-sm-2"></label>
            <div class="col-xs-12 col-sm-8">
                <button type="button" class="btn btn-success btn-embossed" onclick="fsub();">确定</button>
                <a href="/admin/product/reviews?id={$res.pid}" class="btn btn-default btn-embossed">返回</a>
            </div>
        </div>
    </form>
</div>
<script language="javascript" type="text/javascript" src="/assets/My97DatePicker/jquery-1.8.2.js"></script>
<script src="/assets/style/js/updateimg.js"></script>
<script>
       $('.closepic').click(function(){
            $('.upload-text').css("display","none");
            $('#upload-text').css("display","block");
        });

    function img_del(id,obj){
        var img_temp=$("#img_temp").val();
        var str=img_temp+"|"+id;
        $("#img_temp").val(str);
        $(obj).parent('.imglist').css("display","none");
        //$(obj).prev().css("display","none");
    }
    function fsub(){
        var inputstr="";
        $('#showui li').find('img.showimg').each(function(index){
            var imgsrc = $(this).attr('src');
            var inputSrc="<input name='img"+index+"' value='"+imgsrc+"' />";
            inputstr=inputstr+inputSrc;
        });
        console.log(inputstr);
        $("#img").html(inputstr);
        $("#add_form").submit();
    }
</script>
<script>
    $("#thumbnail").change(function () {
        var size = this.files[0].size / 1024;
        if(size > 1024){
            alert('图片大小不能超过1M');
            $('#showImage').hide();
            return;
        }
        var path = $(this).val();
        extStart = path.lastIndexOf('.');
        ext = path.substring(extStart,path.length).toUpperCase();
        if(ext !== '.PNG' && ext !== '.JPG' && ext !== '.JPEG' && ext !== '.GIF'){
            alert('请上传正确格式的图片');
            return false;
        }
        var file = this;
        createReader(file.files[0], function (w, h,u) {
            if(w>800 || h>800){
                alert('图片宽高不得大于800');
                return false;
            }
            $('#showImage').attr("src",u);
            $("#userimg").val(u);
            $('#showImage').show();
        });
    });
    createReader = function(file, whenReady) {
        var reader = new FileReader;
        reader.onload = function (evt) {
            var image = new Image();
            image.onload = function () {
                var pic_url = this.src;
                var width  = this.width;
                var height = this.height;
                if (whenReady) whenReady(width, height , pic_url);
            };
            image.src = evt.target.result;
        };
        reader.readAsDataURL(file);
    }
</script>
<script>
    $(function(){
        $("#user_radio").find("input[name='userid']").eq(0).attr("checked","checked");
    });
    function imgTou(i,obj){
        if($(obj).is(":checked")){
            $(obj).siblings().removeAttr("checked");
            var url="/assets/style/images/tou"+i+".png";
            $("#img_t").val(url);
        }else{
            $("#img_t").val("");
        }
    }
    function fsub(){
        var userid=$("#userid").val();
        if(userid==""){
            alert("用户名不得为空!");
            return;
        }
       /* if(userid.length<6){
            alert("用户名不得小于6字符");
            return;
        }*/
        if($("#img_t").val()==""){
            alert("请选择头像");
            return;
        }
        var inputstr="";
        $('#showui li').find('img.showimg').each(function(index){
            var imgsrc = $(this).attr('src');
            var inputSrc="<input name='img"+index+"' value='"+imgsrc+"' />";
            inputstr=inputstr+inputSrc;
        });
        //console.log(inputstr);
        $("#img").html(inputstr);
        $("#add_form").submit();
    }
</script>
